<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // ES5函数
        // 1.赋值式 匿名式
        // fn();
        // var fn = function(){
        //    console.log('fn');
        // }


        // 2. 命名式 声明式

        // function fn1(){
        //    console.log('fn1');
        // }

        // fn1();


        // ES6箭头函数:赋值函数可  以改成箭头函数
        // var fn =function()
        //   console.log('fn');
        // }

        // var fn = ()=>{
        // console.log('fn');
        // }


        //箭头函数写法: 1.如果是一个参数  可以省略小括号,没有arguments 隐藏参数,可以通过rest 剩余参数代替arguments

        // var fn = function(a){
        //     console.log(a);
        // }
        // fn(10);


        // var fn = ()=>{
        // console.log(a); // 10
        // }
        // fn(10);

        
        var fn = (a,b)=>{
            console.log(a,b);
        }
        fn(1,2);

        //注意:箭头函数没有arguments参数;
        var fn =function(){
            console.log(arguments);
        }

        var fn = (...args)=>{
            console.log(args);
        }
        fn(1,2,3);

        //2.箭头函数 会自带return ,隐式返还
        // 箭头函数后面如果不写大括号会自动返还值;
        var fn = function(a){
            return;
        }

        var fn =a=>{
            return a;
        }

        var fn =a=>a;


        // var fn =()=>{name:'张山',age:20} // 错误写法

        var fn = ()=>({name:'zhangasn',age:20})


        var data = [
            {
                id: 1,
                name: '小明',
                age: 24,
                gender: '男'
            },
            {
                id: 2,
                name: '小芳',
                age: 30,
                gender: '女'
            },
            {
                id: 3,
                name: '小美',
                age: 31,
                gender: '女'
            },
            {
                id: 4,
                name: '小刚',
                age: 21,
                gender: '男'
            },
            {
                id: 5,
                name: '小琪',
                age: 18,
                gender: '女'
            }
        ];


        // 年龄大于20岁且是女生;
        // 不停的.的过程是链式操作
        // $('#box').css().click().eq().end();
        var res = data.filter(function(item){
            return item.age > 20
        }).filter(function(item){
            return item.gender === '女';
        })


        // 箭头函数
        var res = data.filter(item=>item.age > 20).filter(item=>item.gender==='女');
        console.log(res);

        
    </script>
</body>
</html>